<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>开病房页面</title>
    <script src="../../static/js/jquery.js"></script>
    <script src="https://lib.baomitu.com/jquery/3.4.1/jquery.min.js"></script>
    <link rel="stylesheet" href="../css/style.css">
    <link rel="stylesheet" href="../css/responsive.css">
    <link
            rel="stylesheet"
            href="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/css/mdui.min.css"
            integrity="sha384-cLRrMq39HOZdvE0j6yBojO4+1PrHfB7a9l5qLcmRm/fiWXYY+CndJPmyu5FV/9Tw"
            crossorigin="anonymous"
    />
    <script
            src="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/js/mdui.min.js"
            integrity="sha384-gCMZcshYKOGRX9r6wbDrvF+TcCCswSHFucUzUPwka+Gr+uHgjlYvkABr95TCOz3A"
            crossorigin="anonymous"
    ></script>
    <script src="https://lib.baomitu.com/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://lib.baomitu.com/layui/2.6.5/layui.min.js"></script>
    <link href="https://lib.baomitu.com/layui/2.6.5/css/layui.min.css" rel="stylesheet">

    <style>

        .bfid,.ksid{
            border: 1px solid #cacaca;
            font-size: 17px;
            color: #0f4469;
            width: 100%;
            height: 50px;
            background-color: white;
            border-radius: 5px;
        }
        .bed{
            margin: auto;
            width: 100%;
            height: 200px;

        }
        .bed1{
            width: 40%;
            height: 50%;

            float: left;

        }
        .bed2{
            width: 40%;
            height: 50%;

            float: right;

        }
        .bed3{
            width: 40%;
            height: 50%;

            float: left;
        }
        .bed4{
            width: 40%;
            height: 50%;

            float: right;

        }
        .bed img{
            width: 100%;
            height: 100%;
            border-radius: 10px;
            cursor: pointer;

        }

        .bed>div{
            margin: 10px 10px;
        }
    </style>
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 100px;">
</fieldset>
<section class="appointment-one">
    <div class="container">
        <div class="inner-container wow fadeInUp" data-wow-duration="1s">
            <h3 class="appointment-one__title">开病房</h3><!-- /.appointment-one__title -->
            <div class="col-xl-5 col-lg-6">
                    <label class="appointment-one__label">就诊卡号</label>
                    <div class="appointment-one__form-group">
                        <div class="appointment-one__icon">
                            <i class="material-icons">person</i>
                        </div><!-- /.appointment-one__icon -->
                        <input type="text" id="uid" class="name appointment-one__field" placeholder="就诊卡号">
                    </div><!-- /.appointment-one__form-group -->
                        <button type="submit" onclick="queryAll()" class="add appointment-one__btn thm-btn"style="width: 150px;height: 50px;">查询</button>
            </div><!-- /.col-lg-5 -->

            <form class="subscribe appointment-one__form contact-form-vaidated" action="#" method="get">

                <div class="row align-items-end">
                    <div class="col-xl-5 col-lg-6">
                        <label class="appointment-one__label">姓名</label>
                        <div class="appointment-one__form-group">
                            <div class="appointment-one__icon">
                                <i class="material-icons">person</i>
                            </div><!-- /.appointment-one__icon -->
                            <input type="text"id="uname" name="name" class="name appointment-one__field" placeholder="姓名"onfocus=this.blur()>
                        </div><!-- /.appointment-one__form-group -->
                    </div><!-- /.col-lg-5 -->
                    <div class="col-xl-4 col-lg-6">
                        <label class="appointment-one__label">出生日期</label>
                        <div class="appointment-one__form-group">
                            <div class="appointment-one__icon">
                                <i class="material-icons">date_range</i>
                            </div><!-- /.appointment-one__icon -->
                            <input type="date" readonly id="birthday" name="birthday" class="appointment-one__field date1" οnfοcus="WdatePicker({minDate:'%y-%M-{%d}'})"  placeholder="出生日期">
                        </div><!-- /.appointment-one__form-group -->
                    </div><!-- /.col-lg-4 -->

                    <div class="col-xl-3 col-lg-6">
                        <label class="appointment-one__label">性别</label>
                        <div class="appointment-one__form-group">
                            <div class="appointment-one__icon">
                                <i class="material-icons">person</i>
                            </div><!-- /.appointment-one__icon -->
                            <div class="appointment-one__switch-wrap">
                                <input type="hidden"id="sex" name="sex" readonly>
                                <button class="sex1 appointment-one__switch"disabled>男</button>
                                <button class="sex2 appointment-one__switch"disabled>女</button>
                            </div><!-- /.appointment-one__switch-wrap -->
                        </div><!-- /.appointment-one__form-group -->
                    </div><!-- /.col-lg-3 -->
                    <div class="col-xl-5 col-lg-6">
                        <label class="appointment-one__label">电话号码</label>
                        <div class="appointment-one__form-group">
                            <div class="appointment-one__icon">
                                <i class="material-icons">phone</i>
                            </div><!-- /.appointment-one__icon -->
                            <input  type="text"id="phone" name="phone" class="phone appointment-one__field" placeholder="输入号码"onfocus=this.blur()>
                        </div><!-- /.appointment-one__form-group -->
                    </div><!-- /.col-lg-5 -->

                    <div class="col-xl-3 col-lg-6">
                        <label class="appointment-one__label">科室区域</label>
                        <div class="appointment-one__form-group">
                            <select class=" ksid" name="ksid" onchange="loadingConfig(this)">

                            </select>
                        </div><!-- /.appointment-one__form-group -->
                    </div><!-- /.col-lg-5 -->

                    <div class="col-xl-3 col-lg-6">
                        <label class="appointment-one__label">病房区域</label>
                        <div class="appointment-one__form-group">
                            <select class="bfid" name="bfid" onchange="wardConfig(this)">
                                <option value="0">请选择你病房区域</option>
                            </select>
                        </div><!-- /.appointment-one__form-group -->
                    </div><!-- /.col-lg-5 -->

                    <div class="col-xl-4 col-lg-6">
                        <label class="appointment-one__label">房间床位</label>
                        <div class="appointment-one__form-group">
                            <input type="text" id="bed" value="0" style="display: none">
                            <div class="bed">
                                <div class="bed1">
                                    <img class="bed1-1" src="../../img/bingchaung1.jpg" title="一号病床">
                                    <input type="text" value="0" class="bed1-2" style="display: none">
                                </div>
                                <div class="bed2">
                                    <img class="bed2-1" src="../../img/bingchaung1.jpg" title="二号病床">
                                    <input type="text" value="0" class="bed2-2" style="display: none">
                                </div>
                                <div class="bed3">
                                    <img class="bed3-1" src="../../img/bingchaung1.jpg" title="三号病床">
                                    <input type="text" value="0" class="bed3-2" style="display: none">
                                </div>
                                <div class="bed4">
                                    <img class="bed4-1" src="../../img/bingchaung1.jpg" title="四号病床">
                                    <input type="text" value="0" class="bed4-2" style="display: none">
                                </div>


                            </div>
                        </div><!-- /.appointment-one__form-group -->
                    </div><!-- /.col-lg-5 -->



                    <div class="col-xl-3 col-lg-12">
                        <button type="submit"  class="add2 appointment-one__btn thm-btn">入住病房</button>
                    </div><!-- /.col-lg-3 -->

                </div><!-- /.row -->
            </form>
            <div class="result"></div><!-- /.result -->
        </div><!-- /.inner-container -->
    </div><!-- /.container -->
</section><!-- /.appointment-one -->
<a href="#" data-target="html" data-target-offset="0" class="scroll-to-target scroll-to-top"><i class="material-icons">keyboard_arrow_up</i></a>
<!-- /.scroll-to-top -->
<script src="../js/jquery.js"></script>
<script src="../js/bootstrap.bundle.min.js"></script>
<script src="../js/bootstrap-select.min.js"></script>
<script src="../js/owl.carousel.min.js"></script>
<script src="../js/jquery.magnific-popup.min.js"></script>
<script src="../js/bootstrap-datepicker.min.js"></script>
<script src="../js/jquery.validate.min.js"></script>
<script src="../js/wow.min.js"></script>
<script src="../js/theme.js"></script>


<script>
    function myDateFomat(t){
        let date=new Date(t);
        let y=date.getFullYear();
        let m=(date.getMonth()+1).toString().padStart(2,"0");
        let d=date.getDate().toString().padStart(2,"0");
        return y+"-"+m+"-"+d;
    }
</script>


<script>
    function loadingConfig(obj) {

        let id =$(obj).children('option:selected').attr("value");

        let date1=$(".date1").val()

        $.get("/nurse_test2?id="+id,function (date) {

            $(".bfid").empty();
            $(".bfid option[value='0']").remove();
            $(".ksid option[value='0']").remove();
            for (let i = 0; i < date.length; i++) {
                // let num=date[i].docuser.notes-date[i].num;

                $(".bfid").append("<option value="+date[i].bfid+">"+date[i].name+"</option>")

            }
            // $("#select2").append("<option value='Value'>Text</option>");  //添加一项option
        })

        setTimeout(function () {
            let id1 =$(".bfid").children('option:selected').attr("value");

            $.get("/bedsqueryAll?bfid="+id1,function (date) {

                for (let i = 0; i < date.length; i++) {
                    if(date[i].status==0){

                        $(".bed"+(i+1)+"-1").attr('src',"../../img/bingchaung2.jpg");
                        $(".bed"+(i+1)+"-2").val(date[i].id);
                        
                    }else {
                        $(".bed"+(i+1)+"-1").attr('src',"../../img/bingchaung1.jpg");
                        $(".bed"+(i+1)+"-2").val(0);

                    }

                }

            })
        },100)

    }
</script>
<script>
    function queryAll(){
        $.get("/nurse_test1",function (date) {
            $(".ksid").empty();
            $(".ksid").append("<option value="+0+">请选择要住的病房</option>")

            for (let i = 0; i < date.length; i++) {


                $(".ksid").append("<option value="+date[i].bfqyid+">"+date[i].name+"</option>")

            }
        })
    }
</script>
<script>
    $(function () {
        queryAll();
    })
</script>


<script>


        function wardConfig(obj) {
            let id =$(obj).children('option:selected').attr("value");
            // alert(id)

            setTimeout(function () {
                let id1 =$(".bfid").children('option:selected').attr("value");

                $.get("/bedsqueryAll?bfid="+id1,function (date) {

                    for (let i = 0; i < date.length; i++) {
                        if(date[i].status==0){

                            $(".bed"+(i+1)+"-1").attr('src',"../../img/bingchaung2.jpg");
                            $(".bed"+(i+1)+"-2").val(date[i].id);

                        }else {
                            $(".bed"+(i+1)+"-1").attr('src',"../../img/bingchaung1.jpg");
                            $(".bed"+(i+1)+"-2").val(0);

                        }

                    }

                })
            },100)
        }

</script>


<script>
    $(function () {

        $(".bed1-1").click(function () {
            let a=$(".bed1-2").val()

            if(a==0){

                layer.confirm('是否1号入住病床?', {icon: 3, title:'提示'}, function(index){
                    let bed1=$("#bed").val();
                    $("#bed").val(1);



                    if(bed1==0){

                        }else {
                            $(".bed"+bed1+"-1").attr('src',"../../img/bingchaung1.jpg");
                        }

                        $(".bed1-1").attr('src',"../../img/bingchaung3.jpg");



                    layer.close(index);
                });


            }else {
                layer.open({
                    title:'提示'
                    ,content:'该病房已被入住！！'
                    ,icon:2
                })
            }


        })
        $(".bed2-1").click(function () {
            let a=$(".bed2-2").val()

            if(a==0){

                layer.confirm('是否2号入住病床?', {icon: 3, title:'提示'}, function(index){


                    let bed1=$("#bed").val();

                    $("#bed").val(2);

                    if(bed1==0){

                    }else {
                        $(".bed"+bed1+"-1").attr('src',"../../img/bingchaung1.jpg");
                    }

                    $(".bed2-1").attr('src',"../../img/bingchaung3.jpg");

                    layer.close(index);
                });
            }else {
                layer.open({
                    title:'提示'
                    ,content:'该病房已被入住！！'
                    ,icon:2
                })
            }
        })
        $(".bed3-1").click(function () {
            let a=$(".bed3-2").val()
            if(a==0){
                layer.confirm('是否3号入住病床?', {icon: 3, title:'提示'}, function(index){
                    let bed1=$("#bed").val();
                    $("#bed").val(3);


                    if(bed1==0){

                    }else {
                        $(".bed"+bed1+"-1").attr('src',"../../img/bingchaung1.jpg");
                    }

                    $(".bed3-1").attr('src',"../../img/bingchaung3.jpg");


                    layer.close(index);
                });

            }else {
                layer.open({
                    title:'提示'
                    ,content:'该病房已被入住！！'
                    ,icon:2
                })
            }
        })
        $(".bed4-1").click(function () {
            let a=$(".bed4-2").val()
            if(a==0){

                layer.confirm('是否4号入住病床?', {icon: 3, title:'提示'}, function(index){
                    let bed1=$("#bed").val();

                    $("#bed").val(4);

                    if(bed1==0){

                    }else {
                        $(".bed"+bed1+"-1").attr('src',"../../img/bingchaung1.jpg");
                    }

                    $(".bed4-1").attr('src',"../../img/bingchaung3.jpg");


                    layer.close(index);
                });
            }else {
                layer.open({
                    title:'提示'
                    ,content:'该病房已被入住！！'
                    ,icon:2
                })
            }

        })
    })
</script>

<script>
    $(".add").click(function () {
        let id=$("#uid").val();

        let id2="";
        $.get("/thewarqueryByName?id="+id,function (date) {
            if(date==1){

            }else{
                layer.open({
                    title:'提示'
                    ,content:'该用户没有住院手续或者已经住院'
                    ,icon:2
                })

            }
            id2=date;

        })
        setTimeout(function () {
            if(id2=="0"){

            }else{
                if(id!=""){
                    $.get("/warqueryById?visid="+id,function (date) {

                        $("#uname").val(date[0].uname);
                        $("#birthday").val(myDateFomat(date[0].birthday));
                        $("#phone").val(date[0].phone);
                        if(date[0].sex=="男"){

                            $(".sex1").addClass("active");

                        }else{
                            $(".sex2").addClass("active");
                        }


                        $(".ksid").val(1);

                        $.get("/nurse_test2?id="+$(".ksid").val(),function (date) {

                            $(".bfid").empty();
                            $(".bfid option[value='0']").remove();
                            $(".ksid option[value='0']").remove();
                            for (let i = 0; i < date.length; i++) {
                                // let num=date[i].docuser.notes-date[i].num;

                                $(".bfid").append("<option value="+date[i].bfid+">"+date[i].name+"</option>")

                            }
                            // $("#select2").append("<option value='Value'>Text</option>");  //添加一项option
                        })
                        setTimeout(function () {
                            let id1 =$(".bfid").children('option:selected').attr("value");

                            $.get("/bedsqueryAll?bfid="+id1,function (date) {

                                for (let i = 0; i < date.length; i++) {
                                    if(date[i].status==0){

                                        $(".bed"+(i+1)+"-1").attr('src',"../../img/bingchaung2.jpg");
                                        $(".bed"+(i+1)+"-2").val(date[i].id);

                                    }else {
                                        $(".bed"+(i+1)+"-1").attr('src',"../../img/bingchaung1.jpg");
                                        $(".bed"+(i+1)+"-2").val(0);

                                    }

                                }

                            })
                        },100)
                    })

                }
            }
        },100)



    })
</script>


<script>
      $(function () {
            $(".add2").click(function () {
                let bedid=$("#bed").val();
                let uid=$("#uid").val();
                $.get("/openthewardcommit?bedid="+bedid+"&uid="+uid,$(".subscribe").serialize(),function (date) {

                    if(date=="1"){
                        layer.open({
                            title:'提示'
                            ,content:'入住成功！！'
                            ,icon:1
                        })
                        setTimeout(function () {
                            location.reload()
                        },1000)

                    }

                })
                return false;
            })
      })
</script>

</body>
</html>